<template>
    <h1>超市打折活动</h1>
    <h3>今日采购数量：{{ count }}</h3>
    <button v-on:click="count= count + 1 ">数量加+1</button>
    <button v-on:click="addbtn">数量添加</button>
    <button @click="addcnt(5)">每次添加5个</button>
    <hr>
    <a v-on:click="one" href="http://www.baidu.com">阻止跳转百度</a>
    <hr>
    <a v-on:click="two(10,$event)" href="http://www.baidu.com">二次点击阻止跳转</a>
</template>
<script>
export default {
    data() {
        return {
            /**
             *  v-on指令是对事件进行绑定或者是监听指令
             * 语法： v-on:事件名="方法名
             * 简写： @事件名="方法名"
             */
            count: 0
        }
    },
    methods: {
        addbtn() { 
            this.count++
        },
        addcnt(num) { 
            this.count += num
        },
        one(e) { 
            e.preventDefault()
        },
        two(num, e) { 
            this.count += num
            e.preventDefault()
        }
    }
}
</script>